<template>
	<view class="container pdl10 pdr10">
		<view class='email'>
			<view class='contont-desc'>
				<view class="point">
					<span ></span>
				</view>
				<text class="mgl5 fs16 text-black">日期时间</text>
			</view>
			<view  class='invo-view  border-bottom'>
				<input @click="showTimePicker" :value="value" type="text"
					   placeholder="请选择" :disabled="true"
					   class="pdl10"
					   placeholder-class="text-gray">

				<calendar-comp :insert="false" :date="value" ref="calendar" @confirm="confirm"></calendar-comp>
			</view>
		</view>
	</view>
</template>

<script>
    export default {
       data(){
       	return {
			value:'',
		}
	   },
		methods: {
			showTimePicker(){
				this.$refs.calendar.open();
			},
			confirm(e) {
				console.log(e);
				this.value = e.fulldate;
			}
		}
    }
</script>

<style lang="scss" scoped>
	.border{
		border:2upx solid #ddd;
	}
	.email {
		width: 100%;
		height: 150upx;
		line-height: 70upx;
	}
	.invo-view {
		width: 100%;
		height: 70upx;
	}
	.contont-desc {
		display: flex;
		align-items: center;
		width: 100%;
		font-size: 32upx;
		color: #4A4A4A;
		line-height: 70upx;
		height: 70upx;
		/* #ifdef APP-PLUS */
		font-size: 36upx;
		/* #endif */
	}
	.point{
		height: 10upx;
		width: 10upx;
		span{
			background-color: #4151AA;
			display: block;
			width: 100%;
			height: 100%;
			border-radius: 50%;
		}
	}
</style>
